<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>Hello World!</title>
    <style type="text/css">
        body {
            padding: 10px;
        }

        body {
            font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
            font-size: 14px;
            line-height: 1.42857143;
            color: #333;
            background-color: #fff;
        }

        .container {
            background-color: rgb(179, 255, 0);
            width: 100%;
            top: 100px;
        }

    </style>
</head>

<body>
    <div class="container">

        <div>
            <h4>normal</h4>
        </div>
        <div id="div1" style="padding-left: 10px; padding-right: 10px;background-color: antiquewhite;">
            <span>padding-left: 10px; padding-right: 10px;background-color: antiquewhite;</span>
        </div>
        
    </div>
    <script src="../../js/jquery-1.12.4.js"></script>
    <script type="text/javascript">  
        $(document).ready(function(){
            $('#div1').data('hello','World');
        });
    </script>
</body>

</html>